<template>
    <div id="user">
        <el-tag>标签一</el-tag>
        <el-tag type="success">标签二</el-tag>
        <el-tag type="info">标签三</el-tag>
        <el-tag type="warning">标签四</el-tag>
        <el-tag type="danger">标签五</el-tag>
        <div v-for="Tuser in user" :key="Tuser.id">
            <el-row>
                <el-col :span="24">
                    <div class="grid-content bg-purple-dark">
                        <p style="font-size: 36px">个人信息</p>
                    </div>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="12">
                    <div class="grid-content bg-purple">UserName:{{Tuser.username}}</div>
                </el-col>
                <el-col :span="12">
                    <div class="grid-content bg-purple-light">NickName:{{Tuser.nickname}}</div>
                </el-col>
                <el-col :span="12">
                    <div class="grid-content bg-purple-light">Type:{{Tuser.type}}</div>
                </el-col>
            </el-row>

        </div>
<!--表格-->
        <div>
            <el-table
                    :data="tableData"
                    style="width: 100%">
                <el-table-column
                        prop="date"
                        label="订单ID"
                        width="180">
                </el-table-column>
                <el-table-column
                        prop="name"
                        label="客户姓名"
                        width="180">
                </el-table-column>
                <el-table-column
                        prop="address"
                        label="律师姓名">
                </el-table-column>
                <el-table-column
                        prop="address"
                        label="备注">
                </el-table-column>
                <el-table-column
                        prop="address"
                        label="法律类型">
                </el-table-column>
                <el-table-column
                        prop="address"
                        label="是否完成">
                </el-table-column>
                <el-table-column
                        prop="address"
                        label="开始时间">
                </el-table-column>
                <el-table-column
                        prop="address"
                        label="结束时间">
                </el-table-column>
            </el-table>
        </div>
    </div>
</template>

<script>
    // import axios from "axios";
    export default {
        // created() {
        //
        //     axios.get("http://localhost:8080/getUser")
        //         .then(res => this.user = res.data);
        //     axios.get("http://localhost:8080/getOrder")
        //     .then(res=>this.tableData=res.data);
        //
        // },
        name: "User",
        data() {
            return {
                tableData: [],
                user: [],
                id: '',
                username: '',
                password: '',
                nickname: '',
                type: '',
            }
        },
        methods: {},
        computed: {},
    }
</script>

<style scoped>
    .el-row {
      margin-bottom: 20px;
    }

    :last-child {
        margin-bottom: 0;
    }

    .el-col {
        border-radius: 4px;
    }

    .bg-purple-dark {
        background: #99a9bf;
    }

    .bg-purple {
        background: #d3dce6;
    }

    .bg-purple-light {
        background: #e5e9f2;
    }

    .grid-content {
        border-radius: 4px;
        min-height: 36px;
    }

    .row-bg {
        padding: 10px 0;
        background-color: #f9fafc;
    }
</style>